<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <script>
        $(document).ready(function () {
            // //获得文本框对象
            // var t = $("#text_box");
            // //初始化数量为1,并失效减
            // $('#min').attr('disabled', true);
            // //数量增加操作
            // $("#add").click(function () {
            //     // 给获取的val加上绝对值，避免出现负数
            //     t.val(Math.abs(parseInt(t.val())) + 1);
            //     if (parseInt(t.val()) != 1) {
            //         $('#min').attr('disabled', false);
            //     };
            // })
            // //数量减少操作
            // $("#min").click(function () {
            //     t.val(Math.abs(parseInt(t.val())) - 1);
            //     if (parseInt(t.val()) == 1) {
            //         $('#min').attr('disabled', true);
            //     };
            // })
            // function  add(k){
            //     var t = $("#text_box_"+k);
            //     t.val(Math.abs(parseInt(t.val())) + 1);
            //     if (parseInt(t.val()) != 1) {
            //                 $('#min_'+k).attr('disabled', false);
            //     };
            // }
            // function  min(k){
            //     var t = $("#text_box_"+k);
            //     t.val(Math.abs(parseInt(t.val())) + 1);
            //         if (parseInt(t.val()) == 1) {
            //             $('#min_'+k).attr('disabled', true);
            //         };
            // }

        });
        function  add(k){
            var t = $("#text_box_"+k);
            t.val(Math.abs(parseInt(t.val())) + 1);
            if (parseInt(t.val()) != 1) {
                $('#min_'+k).attr('disabled', false);
            }
        }
        function mina(k){
            var t = $("#text_box_"+k);
            t.val(Math.abs(parseInt(t.val())) - 1);
            if (parseInt(t.val()) == 0) {
                $('#min_'+k).attr('disabled', true);
            }
        }
    </script>
</head>
<body>
    <div class="content">
        <form action="#" id="sku-form">
        <div style="display: flex;align-items: center;padding-bottom: 20px;border-bottom: 1px solid #cccccc;">
             <div>
                 <img src="{$good.image|htmlentities}" alt="" style="width: 80px;height: 80px;border-radius: 50%">
             </div>
            <div style="margin-left: 22px;">

                <div  style="font-size: 22px;margin-bottom: 8px;" >{$good.title|htmlentities}</div>
                <div style="color: #808080;">{$good.code|htmlentities}</div>
            </div>

        </div>

        {volist name="list" id="item" key="k"}

        <div style="padding-top: 10px;padding-bottom: 10px">
            <input type="text" name="sku[{$item.id}][goods_id]" value="{$good.id|htmlentities}" style="display: none;">
            <input type="text" name="sku[{$item.id}][image]" value="{$good.image|htmlentities}" style="display: none;">
            <input type="text" name="sku[{$item.id}][goods_title]" value="{$good.title|htmlentities}" style="display: none;">
            <input type="text" name="sku[{$item.id}][price]" value="{$item.price|htmlentities}" style="display: none;">
            <input type="text" name="sku[{$item.id}][sku_id]" value="{$item.id|htmlentities}" style="display: none;">
            <input type="text" name="sku[{$item.id}][type]" value="good" style="display: none;">
            <div style="display: flex;align-items: center;justify-content: space-between">
                <div style="display: flex;align-items: center;font-size: 20px;justify-content: space-between;width: 52%">
                    <div>{$item.difference}</div>
                    <div style="color: red">{$item.price}</div>
                    <input type="text" name="sku[{$item.id}][title]" value="{$item.difference}" style="display: none;">
                    <div style="color: #808080">库存{$item.stock} </div>
                </div>

                <div>
                    <input id="min_{$k}" name="" type="button" value="-" onclick="mina({$k})"  style="width: 35px;height: 35px;border-radius: 50%;border: none;font-size: 25px;color: red"/>
                    <input id="text_box_{$k}" name="sku[{$item.id}][num]" class="text_box_{$k}" type="text" value="0"  style="width: 35px;outline:none;height: 35px;border: none;font-size: 25px;text-align: center"/>
                    <input id="add_{$k}" name="" type="button" value="+" onclick="add({$k})" style="width: 35px;height: 35px;border-radius: 50%;border: none;font-size: 25px;color: red"/>
                </div>
            </div>
        </div>
        {/volist}
        </form>
    </div>

</body>
<style>
   .content{
       width: 92%;
       margin: auto;
       border-radius: 10px;
       padding: 20px;
       background-color: #FFFFFF;
       box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.5);
       margin-top: 28px;
   }
</style>
</html>